<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <p id="content">1</p>
  <button id="btn">点击+1</button>

  <script>

    function watch(target, handle) {
      var proxy = new Proxy(target, {
        get(target, key) {
          return target[key]
        },
        set(target, key, value) {
          target[key] = value
          handle(value)
        }
      })
    }

    let btn = document.querySelector('#btn')
    let p = document.querySelector('#content')

    let obj = { value: 1 }
    
    var proxyObj=watch(obj,(newVal)=>{
      p.innerHTML=newVal
    })

    btn.addEventListener('click', () => {
      proxyObj.value += 1
    })
  </script>
</body>

</html>